<template>
  <div>
    <el-tabs v-model="activeName" type="card">
      <el-tab-pane label="全部" name="all">
        <AllAuditTask :taskItemId=this.taskItemId :taskItemName="taskItemName" :taskItemStatus="taskItemStatus"
                      :taskItemType="taskItemType" system="all"></AllAuditTask>
      </el-tab-pane>
      <el-tab-pane label="知识词条" name="first">
        <AllAuditTask system="knowledge"></AllAuditTask>
      </el-tab-pane>
      <el-tab-pane label="知识规则" name="second">
        <AllAuditTask system="calc"></AllAuditTask>
      </el-tab-pane>
      <el-tab-pane label="流程图" name="three">
        <AllAuditTask ref="flowchart" system="flowchart"></AllAuditTask>
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
import MedicalCalculatorAuditTable from "../calculator/MedicalCalculatorAuditTable";
import AllAuditTask from "../task/auditTask/AllAuditTask";

export default {
  name: "MyAudit",
  components: {
    MedicalCalculatorAuditTable,
    AllAuditTask,
  },
  data() {
    return {
      activeName: 'all',
      taskItemId: '',
      taskItemName: '',
      taskItemType: '',
      taskItemStatus: ''
    }
  },
  activated() {
    this.taskItemId = this.$route.query.taskItemId
    this.taskItemName = this.$route.query.taskItemName
    this.taskItemType = this.$route.query.taskItemType
    this.taskItemStatus = this.$route.query.taskItemStatus
    if (this.$route.query.activeName) {
      this.activeName = this.$route.query.activeName
    }
  },
  watch: {
    activeName(val) {
      val === 'three' ? this.$refs.flowchart.addVisibilityChange() : this.$refs.flowchart.removeVisibilityChange()
    }
  },
  beforeRouteLeave(to, from, next) {
    this.$refs.flowchart.removeVisibilityChange()
    next()
  },
}
</script>

<style scoped>

</style>
